<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>购物车</title>
    <!-- 重置样式 -->
    <link rel="stylesheet" href="../css/normalize.css">

    <!-- 公共样式 -->
    <link rel="stylesheet" href="../css/common.css">

    <!-- 当前页样式 -->
    <link rel="stylesheet" href="../css/shopcar.css">

    <!-- 引入jq -->
    <script src="../lib/jquery.min.js"></script>

    <!-- 引入js -->
    <script src="../js/shopcar.js"></script>
</head>

<body>
    <!-- 页头 -->
    <div class="header">
        <div class="container-fluid bgc000">
            <div class="container clearfix head-top">
                <p class="fl tein">legochina.cn</p>
                <p class="fr">欢迎光临<a href="#">乐购</a>，请 <a href="#">登陆</a>\<a href="#">注册</a></p>
                <h1><a href="#"><img class="nav-title" src="../imgs/shopcar.jpg" alt=""></a></h1>
            </div>
        </div>
        <div class="container clearfix form-head">
            <form action="" class="fr head-search mag30">
                <input class="head-text" type="text" placeholder="创意文具">
                <input class="head-btn" type="submit" value="">
            </form>
        </div>
    </div>

    <!-- 购物车 -->
    <div class="shopcar container mag30">
        <p class="fs22 bgf60">全部商品（3）</p>
        <div class="shopcar-head clearfix">
            <p><input class="allsel" type="checkbox">全选</p>
            <p>商品</p>
            <p>单价</p>
            <p>数量</p>
            <p>小计</p>
            <p>操作</p>
        </div>

        <div class="shopcar-body clearfix">
            <p><input class="sinsel" type="checkbox"></p>
            <p>
                <img src="../imgs/index08_05.jpg" alt="">
                从你到全世界路过
            </p>
            <p class="sinprice">41.00</p>
            <p>
                <span class="reduce">-</span>
                <input class="pronum" type="text" value="1">
                <span class="add">+</span>
            </p>
            <p class="smallprice">41.00</p>
            <p>删除<br>移到我的关注</p>
        </div>
        <div class="shopcar-body clearfix">
            <p><input class="sinsel" type="checkbox"></p>
            <p>
                <img src="../imgs/index08_05.jpg" alt="">
                从你到全世界路过
            </p>
            <p class="sinprice">41.00</p>
            <p>
                <span class="reduce">-</span>
                <input class="pronum" type="text" value="1">
                <span class="add">+</span>
            </p>
            <p class="smallprice">41.00</p>
            <p>删除<br>移到我的关注</p>
        </div>
        <div class="shopcar-body clearfix">
            <p><input class="sinsel" type="checkbox"></p>
            <p>
                <img src="../imgs/index08_05.jpg" alt="">
                从你到全世界路过
            </p>
            <p class="sinprice">41.00</p>
            <p>
                <span class="reduce">-</span>
                <input class="pronum" type="text" value="1">
                <span class="add">+</span>
            </p>
            <p class="smallprice">41.00</p>
            <p>删除<br>移到我的关注</p>
        </div>

        <div class="shopcar-foot">
            <p><input class="allsel" type="checkbox"> 全选</p>
            <p>删除选中商品</p>
            <p></p>
            <p>已选择 <span class="bgf60 allNum">1</span> 件商品</p>
            <p><span class="fs16 cl33">总价:</span> <span class="bgf60 allPrice">41.00</span></p>
            <p><button>去结算</button></p>
        </div>
    </div>

    <!-- 猜你喜欢 -->
    <div class="container sale mag30">
        <div class="sale-top">
            <span class="fs22">猜你喜欢</span>
        </div>
        <ul class="clearfix">
            <script>
                for (let i = 0; i < 10; i++) {
                    document.write(`
                    <li>
                        <img src="../imgs/22935553-1_l.jpg" alt="">
                        <img src="../imgs/index05_18.jpg" alt="">
                        <p class="fs13">白夜行 东野圭吾</p>
                        <img class="mt5" src="../imgs/推荐.jpg" alt="">
                        <p class="mt10"><span class="clf42">￥38</span>&nbsp;&nbsp;&nbsp;<del class="clb3 del">￥58</del></p>
                    </li>
                    `)
                }
            </script>
        </ul>
    </div>

    <!-- 页尾广告图 -->
    <div class="container monster mag90"></div>


    <!-- 页尾 -->
    <div class="footer">
        <div class="re-title bgf60">
        </div>
        <div class="container-fluid footer-big">
            <div class="container footer-center">
                <span><img src="../imgs/222_11.png" alt=""></span>
                <span><img src="../imgs/222_13.png" alt=""></span>
                <span><img src="../imgs/222_15.png" alt=""></span>
                <span><img src="../imgs/222_17.png" alt=""></span>
            </div>
        </div>
        <div class="container footer-nav clearfix">
            <div>
                <h4><a href="#">购物指南</a></h4>
                <p><a href="#">购物流程</a></p>
                <p><a href="#">发票制度</a></p>
                <p><a href="#">账户管理</a></p>
                <p><a href="#">会员优惠</a></p>
            </div>
            <div>
                <h4><a href="#">支付方式</a></h4>
                <p><a href="#">货到付款</a></p>
                <p><a href="#">网上支付</a></p>
                <p><a href="#">礼品卡支付</a></p>
                <p><a href="#">银行转帐</a></p>
            </div>
            <div>
                <h4><a href="#">订单服务</a></h4>
                <p><a href="#">订单配送查询</a></p>
                <p><a href="#">订单状态说明</a></p>
                <p><a href="#">自助取消订单</a></p>
                <p><a href="#">自助修改订单</a></p>
            </div>
            <div>
                <h4><a href="#">退换货</a></h4>
                <p><a href="#">退换货政策</a></p>
                <p><a href="#">自助申请退换货</a></p>
                <p><a href="#">退换货进度查询</a></p>
                <p><a href="#">退款方式和时间</a></p>
            </div>
            <div>
                <h4><a href="#">商家服务</a></h4>
                <p><a href="#">商家中心</a></p>
                <p><a href="#">运营服务</a></p>
                <p><a href="#">加入尾品汇</a></p>
            </div>
            <div>
                <img src="../imgs/logo_00.png" alt="">
            </div>
        </div>
        <p>公司简介 | Investor Relations | 网站联盟 | 乐购招商 | 机构销售 | 手机乐购 | 官方Blog | 热词搜索</p>
        <p>Copyright (C) 乐购网 2004-2016, All Rights Reserved</p>

    </div>
</body>

</html>